<!DOCTYPE html>
<html lang="zh-cn">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
    <title>个人主页</title>


    <!-- Expand styles -->
    <link href="../css/app/app.css" rel="stylesheet">
    <link href="../css/app/default.css" rel="stylesheet">
    <link href="../css/mui/mui.css" rel="stylesheet">


    <!-- Custom styles for this template -->
    <!-- <link href="../css/iOS/mobile/mobile.css" rel="stylesheet"> -->
</head>

<body>

    <div>
        <div class="widget-body bc-head display-flex ">
            <div class="display-flex flex-column align-items-center width20">
                <img class="person-img" src="../img/a.png" alt="">
                <span class="white font-17 text-center padding-t-10 elli1">大魔王魔王魔王魔魔王魔</span>
            </div>
            <div class="margin-l-10 width-100 padding-t-10">
                <div class="display-flex justify-content-around align-items-center white">
                    <div class="display-flex flex-column align-items-center">
                        <span class="font-18 font-weight text-center">40</span>
                        <span class="white font-13 text-center">关注</span>
                    </div>
                    <div class="display-flex flex-column align-items-center">
                        <span class="font-18 font-weight text-center">40</span>
                        <span class="white font-13 text-center">粉丝</span>
                    </div>
                    <div class="display-flex flex-column align-items-center">
                        <span class="font-18 font-weight text-center">40</span>
                        <span class="white font-13 text-center">视频</span>
                    </div>
                </div>
                <div class="add-pay">
                    +关注
                </div>
            </div>
        </div>
        <div class="mobile-content5">
            <div class="widget-default margin-b-5">
                <div class="farming-tab-two diff-fixed">
                    <div id="segmentedControl" class="mui-segmented-control">
                        <a class="mui-control-item mui-active" href="#item1">农技视频</a>
                        <a class="mui-control-item" href="#item2">小视频</a>
                    </div>
                </div>
            </div>
            <!-- 农技视频 -->
            <div id="item1" class="margin-t-52 mui-control-content mui-active">
                <!-- 视频列表 -->
                <div class="widget-body widget-default margin-b-5">
                    <div class="display-flex padding-b-10">
                        <img class="farm-head" src="../img/a.png" alt="">
                        <div class="display-flex flex-column justify-content-between margin-l-10">
                            <span class="elli1 font-weight black font-16 font-weight no-margin">江铃</span>
                            <span class="gray font-12">2019-10-21</span>
                        </div>
                    </div>
                    <div class="margin-t-5 trade-list">
                        <div class="video-shade1"></div>
                        <div class="position-open1">
                            <img class="open-img" src="../img/open.png" alt="">
                        </div>
                        <!-- <video width="100%" height="177" controls autoplay>
                                <source src="../text.mp4" type="video/ogg" />
                                您的浏览器不支持Video标签。
                            </video> -->
                        <div class="height177 width-100">
                            <img class="height177 width-100" src="../img/a.png" alt="">
                        </div>
                        <p class=" elli1 black font-15 padding-t-15 padding-l-5 no-margin">
                            苹果的栽培技术苹果的栽培技术苹果的的栽培技术苹果的栽培技术的栽培技术苹果的栽培技术</p>
                    </div>
                    <div class="display-flex justify-content-end align-items-center padding-t-6">
                        <img class="farm-icon" src="../img/new-expert/info.png" alt="">
                        <span class="gray font-12 padding-l-5 padding-r-10">10</span>
                        <img class="farm-icon" src="../img/new-expert/share.png" alt="">
                        <span class="gray font-12 padding-l-5 padding-r-10">10</span>
                        <img class="farm-icon" src="../img/zai.png" alt="">
                        <span class="gray font-12 padding-l-5">10</span>
                    </div>
                </div>
                <div class="widget-body widget-default margin-b-5">
                    <div class="display-flex padding-b-10">
                        <img class="farm-head" src="../img/a.png" alt="">
                        <div class="display-flex flex-column justify-content-between margin-l-10">
                            <span class="elli1 font-weight black font-16 font-weight no-margin">江铃</span>
                            <span class="gray font-12">2019-10-21</span>
                        </div>
                    </div>
                    <div class="margin-t-5 trade-list">
                        <div class="video-shade1"></div>
                        <div class="position-open1">
                            <img class="open-img" src="../img/open.png" alt="">
                        </div>
                        <!-- <video width="100%" height="177" controls autoplay>
                                <source src="../text.mp4" type="video/ogg" />
                                您的浏览器不支持Video标签。
                            </video> -->
                        <div class="height177 width-100">
                            <img class="height177 width-100" src="../img/a.png" alt="">
                        </div>
                        <p class=" elli1 black font-15 padding-t-15 padding-l-5 no-margin">
                            苹果的栽培技术苹果的栽培技术苹果的的栽培技术苹果的栽培技术的栽培技术苹果的栽培技术</p>
                    </div>
                    <div class="display-flex justify-content-end align-items-center padding-t-6">
                        <img class="farm-icon" src="../img/new-expert/info.png" alt="">
                        <span class="gray font-12 padding-l-5 padding-r-10">10</span>
                        <img class="farm-icon" src="../img/new-expert/share.png" alt="">
                        <span class="gray font-12 padding-l-5 padding-r-10">10</span>
                        <img class="farm-icon" src="../img/zai.png" alt="">
                        <span class="gray font-12 padding-l-5">10</span>
                    </div>
                </div>
            </div>
            <!-- 小视频 -->
            <div id="item2" class="margin-t-52 mui-control-content">

                <!-- 视频列表 -->
                <div class="display-flex flex-warp">
                    <div class="littlevideo-box">
                        <video width="100%" height="254" autoplay>
                            <source src="../text.mp4" type="video/ogg" />
                            您的浏览器不支持Video标签。
                        </video>
                        <!-- <img src="../img/video-bg.png" alt="" class="littlevideo-img"> -->
                        <div class="littlevideo-shade">
                            <p class="elli2 white font-12">柠檬大棚养殖技术柠檬大棚养殖 技术柠檬大棚养殖技术柠术柠檬大棚养殖技术柠檬大棚养殖技</p>
                            <p class="white font-12">700次<span class="padding-l-10">播放</span></p>
                        </div>
                    </div>
                    <div class="littlevideo-box">
                        <video width="100%" height="254" autoplay>
                            <source src="../text.mp4" type="video/ogg" />
                            您的浏览器不支持Video标签。
                        </video>
                        <!-- <img src="../img/video-bg.png" alt="" class="littlevideo-img"> -->
                        <div class="littlevideo-shade">
                            <p class="elli2 white font-12">柠檬大棚养殖技术柠檬大棚养殖 技术柠檬大棚养殖技术柠术柠檬大棚养殖技术柠檬大棚养殖技</p>
                            <p class="white font-12">700次<span class="padding-l-10">播放</span></p>
                        </div>
                    </div>
                    <div class="littlevideo-box">
                        <video width="100%" height="254" autoplay>
                            <source src="../text.mp4" type="video/ogg" />
                            您的浏览器不支持Video标签。
                        </video>
                        <div class="littlevideo-shade">
                            <p class="elli2 white font-12">柠檬大棚养殖技术柠檬大棚养殖 技术柠檬大棚养殖技术柠术柠檬大棚养殖技术柠檬大棚养殖技</p>
                            <p class="white font-12">700次<span class="padding-l-10">播放</span></p>
                        </div>
                    </div>
                    <div class="littlevideo-box">
                        <video width="100%" height="254" autoplay>
                            <source src="../text.mp4" type="video/ogg" />
                            您的浏览器不支持Video标签。
                        </video>
                        <div class="littlevideo-shade">
                            <p class="elli2 white font-12">柠檬大棚养殖技术柠檬大棚养殖 技术柠檬大棚养殖技术柠术柠檬大棚养殖技术柠檬大棚养殖技</p>
                            <p class="white font-12">700次<span class="padding-l-10">播放</span></p>
                        </div>
                    </div>
                    <div class="littlevideo-box">
                        <video width="100%" height="254" autoplay>
                            <source src="../text.mp4" type="video/ogg" />
                            您的浏览器不支持Video标签。
                        </video>
                        <div class="littlevideo-shade">
                            <p class="elli2 white font-12">柠檬大棚养殖技术柠檬大棚养殖 技术柠檬大棚养殖技术柠术柠檬大棚养殖技术柠檬大棚养殖技</p>
                            <p class="white font-12">700次<span class="padding-l-10">播放</span></p>
                        </div>
                    </div>
                    <div class="littlevideo-box">
                        <video width="100%" height="254" autoplay>
                            <source src="../text.mp4" type="video/ogg" />
                            您的浏览器不支持Video标签。
                        </video>
                        <div class="littlevideo-shade">
                            <p class="elli2 white font-12">柠檬大棚养殖技术柠檬大棚养殖 技术柠檬大棚养殖技术柠术柠檬大棚养殖技术柠檬大棚养殖技</p>
                            <p class="white font-12">700次<span class="padding-l-10">播放</span></p>
                        </div>
                    </div>


                </div>
            </div>

        </div>
    </div>
    <div class="hobby-footer1 bg-transparent">
        <div class="display-flex align-items-center bot-issue" id="imgpop">
            <img class="issue-img" src="../img/issue.png" alt="">
        </div>
    </div>
    <div id="topProp" class="topProp"></div>
    <div class="propbottom">
        <div class="display-flex align-items-center justify-content-around widget-default padding-t-15 padding-b-15">
            <div class="display-flex flex-column align-items-center" id="leftProp">
                <img class="issue-img" src="../img/farm-video.png" alt="">
                <span class="font-17 blue1">农技视频</span>
            </div>
            <div class="display-flex flex-column align-items-center" id="rightProp">
                <img class="issue-img" src="../img/little-video.png" alt="">
                <span class="font-17 blue1">小视频</span>
            </div>
        </div>
    </div>




    <script type="text/javascript" src="../js/jquery.js"></script>
    <script type="text/javascript" src="../js/mui/mui.js"></script>
    <script>
        $("#imgpop").click(function () {
            $(".propbottom").show();
            $("#topProp").show();
        })
        $("#leftProp").click(function () {
            $(".propbottom").hide();
        })
        $("#rightProp").click(function () {
            $(".propbottom").hide();
        })
        $("#topProp").click(function () {
            $(".propbottom").hide();
            $("#topProp").hide();
        })
    </script>

</body>

</html>